<template>
	<view class="pug-course-list2">
			<view class="item" @click="toLink(item.id)" v-for="(item,index) in dataList" :key="item.id">
				<u-image width="100%" height="100px" :src="item.img"></u-image>
				<view class="pug-content">
					<view class="pug-list-content">
						<text class="tit">{{item.title}}</text>
						<text class="description">{{item.description}}</text>
					</view>
					<text class="price">￥{{item.realprice}} 分佣价格：￥{{item.commission}}</text>
				</view>
			</view>
		</view>
</template>

<script>
	export default {
		name:"pug-course-list2",
		props:{
			dataList: {
				type: Array,
				default: []
			}
		},
		data() {
			return {
				
			};
		},
		methods: {
			toLink(courseId){
				uni.navigateTo({
					url: "/pages/coursedetail/coursedetail?courseId=" + courseId
				})
			}
		}
	}
</script>

<style lang="scss">
	.pug-course-list2{
			padding: 30rpx;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			.item{
				width: calc(50% - 15rpx);
				margin-right: 15rpx;
				margin-bottom: 30rpx;
				background: #fff;
				display: flex;
				flex-direction: column;
				// 每逢2是不加边距的
				&:nth-child(2n){
					margin-right: 0;
				}
				.pug-content{
					display: flex;
					flex-direction: column;
					height: 100%;
					justify-content: space-between;
					.pug-list-content{
						margin-top: 10rpx;
						.tit{
							font-size:28rpx;
							color:#333;
							
							overflow : hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-line-clamp: 1;
							-webkit-box-orient: vertical;
						}
						.tags{
							word-break: break-word;
							font-size:22rpx;
							color:#666;
							margin-top: 10rpx;
						}
						.description{
							margin-top: 10rpx;
							font-size:24rpx;
							color:#666;
							
							overflow : hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-line-clamp: 2;
							-webkit-box-orient: vertical;
						}
					}
					.price{
						color: #ff0000;
						font-size: 26rpx;
						margin-top: 17rpx;
					}
				}
				
			}
		}
</style>